<!DOCTYPE html>
<html>

<head>
	<meta charset="utf-8">
	<script type="text/javascript" src="static/assets/global/plugins/jquery-1.11.0.min.js"></script>
	<link rel="stylesheet" type="text/css" href="static/assets/global/plugins/bootstrap/css/bootstrap.min.css">
	<link rel="stylesheet" type="text/css" href="static/assets/global/css/components.css">
	<link rel="stylesheet" type="text/css" href="static/assets/admin/pages/css/login.css">
	<title></title>
</head>

<body class="login">
	<div class="content">
		<h3 class="form-title">商品详情</h3>
		<div id="promoStartDateContainer" class="form-group">
			<label style="color:blue" id="promoStatus" class="control-label">秒杀开始时间</label>
			<div>
				<label style="color:red" class="control-label" id="promoStartDate" />
			</div>
		</div>
		<div class="form-group">
			<div>
				<label class="control-label" id="title" />
			</div>
		</div>
		<div class="form-group">
			<div>
				<img style="width:200px;height:auto;" id="imgUrl">
			</div>
		</div>
		<div class="form-group">
			<label class="control-label">商品描述</label>
			<div>
				<label class="control-label" id="description" />
			</div>
		</div>
		<div id="normalPriceContainer" class="form-group">
			<label class="control-label">商品价格</label>
			<div>
				<label class="control-label" id="price" />
			</div>
		</div>
		<div id="promoPriceContainer" class="form-group">
			<label style="color:red" class="control-label">秒杀价格</label>
			<div>
				<label style="color:red" class="control-label" id="promoPrice" />
			</div>
		</div>
		<div class="form-group">
			<label class="control-label">商品库存</label>
			<div>
				<label class="control-label" id="stock" />
			</div>
		</div>
		<div class="form-group">
			<label class="control-label">商品销量</label>
			<div>
				<label class="control-label" id="sales" />
			</div>
		</div>
		<div class="form-actions">
			<button class="btn blue" id="createOrder" type="submit">
				立即购买
			</button>
		</div>
	</div>
</body>

<script>
	var g_itemVO = {};
	$(document).ready(function() {
		// 获取商品详情
		$.ajax({
			type: "GET",
			url: "http://localhost:8080/item/get",
			data: {
				"id": getParam("id"),
			},
			xhrFields:{
				withCredentials:true
			},
			success: function(data) {
				if (data.status == "success") {
					g_itemVO = data.data;
					reloadDom();
					setInterval(reloadDom, 1000);
				} else {
					alert("获取信息失败，原因为" + data.data.errMsg);
				}
			},
			error: function(data) {
				alert("获取信息失败，原因为" + data.responseText);
			}
		});


		$("#createOrder").on("click", function() {
			$.ajax({
				type: "POST",
				url: "http://localhost:8080/order/createorder",
				contentType: "application/x-www-form-urlencoded",
				data: {
					"itemId": g_itemVO.id,
					"promoId": g_itemVO.promoId,
					"amount": 1,
				},
				xhrFields:{
					withCredentials:true
				},
				success: function(data) {
					if (data.status == "success") {
						alert("下单成功");
						window.location.reload();
					} else {
						alert("下单失败，原因为" + data.data.errMsg);
						if (data.data.errCode == 20003) {
							window.location.href="login.html";
						}
					}
				},
				error: function(data) {
					alert("下单失败，原因为" + data.responseText);
				}
			});
		});

	});

	function reloadDom() {
		$("#title").text(g_itemVO.title);
		$("#imgUrl").attr("src", g_itemVO.imgUrl);
		$("#description").text(g_itemVO.description);
		$("#price").text(g_itemVO.price);
		$("#stock").text(g_itemVO.stock);
		$("#sales").text(g_itemVO.sales);
		if (g_itemVO.promoStatus == 1) {
			// 秒杀活动还未开始
			var startTime = g_itemVO.promoStartDate.replace(new RegExp("-", "gm"), "/");
			startTime = (new Date(startTime)).getTime();
			var nowTime = Date.parse(new Date());
			var delta = (startTime - nowTime) / 1000;
			if (delta <= 0) {
				// 活动开始了
				g_itemVO.promoStatus = 2;
				reloadDom();
			}

			$("#promoStartDate").text("秒杀活动将于："+g_itemVO.promoStartDate+" 开始售卖 倒计时："+delta+" 秒");
			$("#promoPrice").text(g_itemVO.promoPrice);

			$("#createOrder").attr("disabled", true);
		} else if (g_itemVO.promoStatus == 2) {
			// 秒杀活动进行中
			$("#promoStartDate").text("秒杀活动进行中");
			$("#promoPrice").text(g_itemVO.promoPrice);

			$("#createOrder").attr("disabled", false);
			$("#normalPriceContainer").hide();
		}
	}

	function getParam(paramName) {            
		paramValue = "", isFound = !1;         
		if (this.location.search.indexOf("?") == 0 && this.location.search.indexOf("=") > 1) {               
			arrSource = unescape(this.location.search).substring(1, this.location.search.length).split("&"), i = 0;               
			while (i < arrSource.length && !isFound) 
				arrSource[i].indexOf("=") > 0 && arrSource[i].split("=")[0].toLowerCase() == paramName.toLowerCase() && (paramValue = arrSource[i].split("=")[1], isFound = !0), i++
		}           
		return paramValue == "" && (paramValue = null), paramValue      
	}
</script>

</html>